	<!--
	Author: W3layouts
	Author URL: http://w3layouts.com
	License: Creative Commons Attribution 3.0 Unported
	License URL: http://creativecommons.org/licenses/by/3.0/
	-->
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8">
	<title>胡伟强的个人主页</title>
	<link rel="shortcut icon" href="./images/logo.png" type="image/x-icon" />
	<link href="./css/bootstrap.css" rel='stylesheet' type='text/css' />
	<!-- Custom Theme files -->
	<link href="./css/style.css" rel="stylesheet" type="text/css" media="all" />
	<!-- Custom Theme files -->
	<script src="./js/jquery.min.js"></script>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
	<!--webfont-->
	<link href='http://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700' rel='stylesheet' type='text/css'>
	<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900,200italic,300italic,400italic,600italic,700italic,900italic' rel='stylesheet' type='text/css'>
	    <script type="text/javascript" src="./js/move-top.js"></script>
	<script type="text/javascript" src="./js/easing.js"></script>
	<script type="text/javascript">
				jQuery(document).ready(function($) {
					$(".scroll").click(function(event){		
						event.preventDefault();
						$('html,body').animate({scrollTop:$(this.hash).offset().top},1200);
					});
				});

				function prompt(){
					var isChrome = window.navigator.userAgent.indexOf("Chrome") !== -1;
					if(!isChrome){
						alert("建议用chrom浏览器浏览此网页");
					}
				}
				window.onload = prompt;
			</script>
	</head>
	<body>
	 <!-- header-section-starts -->
	    <div class="header">
			<div class="header-banner">
				<div class="container">
					<div class="top-menu">
					    <span class="menu"> </span>
						    <ul>
								<li><a href="#ABOUT" class="scroll">关于我</a></li>
								<li><a href="#WORK" class="scroll">作品/项目</a></li>
								<li><a href="#BLOG" class="scroll">个人博客</a></li>
								<li><a href="#CONTACT" class="scroll">快联系我</a></li>
								<div class="clearfix"></div>
							</ul>
					    </div>
			 <!--script-nav-->
			 <script>
			 $("span.menu").click(function(){
			 $(".top-menu ul").slideToggle("slow" , function(){
			 });
			 });
			 </script>
					<div class="header-banner-info text-center">
						<a href="#"><img src="./images/logo.png" alt="" /></a>
						<h3>您好</h3>
						<h3>欢迎访问我的个人主页</h3>
						<p>我是一名程序猿</p>
						<ul class="details">
							<li>年龄     :     <a href="#">22</a></li>
							<li>国家     :     <a href="#">中国</a></li>
							<li>工作城市     :     <a href="#">上海</a></li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	    <!-- header-section-ends -->
	    <!-- content-section-starts -->
	    <div class="content-section">
		    <!-- about-section-starts -->
			<div class="about-section" id="ABOUT">
				<div class="container">
					<div class="about-section-head text-center">
						<img src="./images/head.png" alt="" />
						<h3>关于我</h3>
						<label></label>
						<p>Do you want to know me?</p>
					</div>
					<div class="about-section-grids">
						<div class="col-md-4 about-section-grid-1">
							<h4>个人简介</h4>
							<p>姓名：胡伟强 性别：男 Tel：18521595797 <br>Email：weiqianghu_ecust@163.com</p>
							<p>籍贯：甘肃 平凉 政治面貌：中共党员</p>
							<p>学习经历</p>
							<p>华东理工大学 计算机科学与技术 本科 2012.9——2016.6</p>
							<p>所获奖项</p>
							<p>国家励志奖学金（两次） 2013.9、2014.9
							<br>华东理工大学综合课程奖学金（两次） 2013.9、2014.9
							<br>上海市计算机应用能力大赛优胜奖 2015.5
							<br>热带风暴优秀学生员工称号 2014.11</p>
						</div>
						<div class="col-md-4 about-section-grid-2 text-center">
							<img src="./images/hwq.jpg" class="img-responsive" alt="" /> 
						</div>
						<div class="col-md-4 about-section-grid-3">
							<h4>掌握技术</h4>
							<p>后台语言</p>
							<div class="progress-grid">
					  	       <div class="meter red">
								   <span style="width:75%;">
								  	<div class="progress_desc">java</div>
									<div class="percent">熟悉</div> 
							        <div class="clearfix"> </div>
							       </span>
								</div>
								<div class="meter animate">
								   <span style="width:70%;"><div class="progress_desc">C</div>
									<div class="percent">熟悉</div> 
							        <div class="clearfix"> </div>
								   </span>
								</div>
								<div class="meter">
									<span style="width:70%;"><div class="progress_desc">MySql</div>
									 <div class="percent">熟悉</div> 
									 <div class="clearfix"> </div>
								    </span>
								</div>
								<div class="meter">
									<span style="width:55%;"><div class="progress_desc">c#</div>
									 <div class="percent">了解</div> 
									 <div class="clearfix"> </div>
								    </span>
								</div>
							</div>
							<p>前端语言</p>
							<div class="progress-grid">
					  	       <div class="meter red">
								   <span style="width:70%;">
								  	<div class="progress_desc">HTML / HTML5</div>
									<div class="percent">熟悉</div> 
							        <div class="clearfix"> </div>
							       </span>
								</div>
								<div class="meter animate">
								   <span style="width:65%;"><div class="progress_desc">CSS / CSS3</div>
									<div class="percent">熟悉</div> 
							        <div class="clearfix"> </div>
								   </span>
								</div>
								<div class="meter">
									<span style="width:55%;"><div class="progress_desc">JavaScript / jquery</div>
									 <div class="percent">了解</div> 
									 <div class="clearfix"> </div>
								    </span>
								</div>
							</div>
						  </div>
						<div class="clearfix"></div>
					</div>
				</div>
			</div>
			<!-- about-section-ends -->
			<!-- portfolio-section-starts -->
			<div class="portfolio-section" id="WORK">
				<div class="portfolio-section-top-row">
					<div class="container">
						<div class="portfolio-section-head text-center">
							<h3>作品/项目经验</h3>
							<label></label>
							<p>Do you want to know me?</p>
						</div>
						<div class="col-md-4 portfolio-section-top-row-left-grid">
							<div class="project-name">
								<a href="http://cleme.aliapp.com/" target="target_blank"><h3>吃了么网上点餐系统(点我)</h3></a>
							</div>
							<div class="project-description">
								 <span>时间：2015.2——2015.4</span>
							</div>

							<div class="project-name">
								<a href="http://daxuewen.xyz/" target="target_blank"><h3>你好大学(点我)</h3></a>
							</div>
							<div class="project-description">
								 <span>时间：2015.4——2015.6</span>
							</div>

							<div class="project-name">
								<a href="#" target="target_blank"><h3>医药通网上卖药系统</h3></a>
							</div>
							<div class="project-description">
								 <span>时间：2015.3——2015.6</span>
							</div>

							<div class="project-name">
								<a href="http://blog.csdn.net/weiqianghu/article/details/46640403" target="target_blank"><h3>Linux Shell(点我)</h3></a>
							</div>
							<div class="project-description">
								 <span>时间：2015.6</span>
							</div>
						</div>
						<div class="col-md-8 portfolio-section-top-row-right-grid">
			<div class="wmuSlider example1 section" id="section-1">
				   <article style="position: absolute; width: 100%; opacity: 0;"> 
						<img style="width:730px;height:456.25px" src="./images/img1.jpg" class="img-responsive" alt="">
					</article>
					<article style="position: absolute; width: 100%; opacity: 0;"> 
	`					<img style="width:730px;height:456.25px" src="./images/img2.jpg" class="img-responsive" alt="">
					</article>
					<article style="position: absolute; width: 100%; opacity: 0;"> 
						<img style="width:730px;height:456.25px" src="./images/img3.jpg" class="img-responsive" alt="">
					</article>
					<ul class="wmuSliderPagination">
	                	<li><a href="#" class="">0</a></li>
	                	<li><a href="#" class="">1</a></li>
	                	<li><a href="#" class="">2</a></li>
	                </ul>

			  </div>
				  
				  <!-- script -->
				  <script src="./js/jquery.wmuSlider.js"></script> 
					<script>
						$('.example1').wmuSlider();         
					</script>
					<!-- script -->	

				     </div>
				    <div class="clearfix"></div>
				  </div>
				</div>
				<div class="portfolio-section-bottom-row" id="portfolio">
				<div class="container">
			 <ul id="filters" class="clearfix">
							<li><span class="filter active" data-filter="app card icon web logo1">全部</span></li>
							<li><span class="filter" data-filter="app">吃了么网上点餐系统</span></li>
							<li><span class="filter" data-filter="card">你好大学</span></li>
							<li><span class="filter" data-filter="icon">医药通网上卖药系统</span></li>
							<li><span class="filter" data-filter="logo1">Linux Shell</span></li>
							</ul>
						<div id="portfoliolist">
						<div class="portfolio card mix_all  wow bounceIn" data-wow-delay="0.4s" data-cat="card" style="display: inline-block; opacity: 1;">
							<div class="portfolio-wrapper">		
								<a href="#small-dialog" class="b-link-stripe b-animate-go  thickbox play-icon popup-with-zoom-anim">
							     <img src="./images/pic-1.jpg" class="img-responsive" alt="" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 ">&nbsp&nbsp&nbsp你好大学&nbsp&nbsp&nbsp<img src="./images/icon-eye.png" alt=""/></h2>
							  	</div></a>
			                </div>
						</div>				
						<div class="portfolio app mix_all  wow bounceIn" data-wow-delay="0.4s" data-cat="app" style="display: inline-block; opacity: 1;">
							<div class="portfolio-wrapper">		
								<a href="#small-dialog1" class="b-link-stripe b-animate-go  thickbox play-icon popup-with-zoom-anim">
							     <img src="./images/pic-2.jpg" class="img-responsive" alt="" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 ">吃了么网上点餐系统<img src="./images/icon-eye.png" alt=""/></h2>
							  	</div></a>
			                </div>
						</div>		
						<div class="portfolio icon mix_all  wow bounceIn" data-wow-delay="0.4s" data-cat="icon" style="display: inline-block; opacity: 1;">
							<div class="portfolio-wrapper">		
								<a href="#small-dialog3" class="b-link-stripe b-animate-go  thickbox play-icon popup-with-zoom-anim">
							     <img src="./images/pic-4.jpg" class="img-responsive" alt="" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 ">医药通网上卖药系统<img src="./images/icon-eye.png" alt=""/></h2>
							  	</div></a>
			                </div>

						</div>
						<div class="portfolio logo1 mix_all  wow bounceIn" data-wow-delay="0.4s" data-cat="logo1" style="display: inline-block; opacity: 1;">
							<div class="portfolio-wrapper">		
								<a href="#small-dialog7" class="b-link-stripe b-animate-go  thickbox play-icon popup-with-zoom-anim">
							     <img src="./images/pic-8.jpg" class="img-responsive" alt="" /><div class="b-wrapper"><h2 class="b-animate b-from-left    b-delay03 ">&nbsp&nbsp&nbspLinux shell&nbsp&nbsp&nbsp<img src="./images/icon-eye.png" alt=""/></h2>
							  	</div></a>
			                </div>
						</div>	

	<div class="clearfix"></div>					
					</div>
			  <div class="clearfix"></div>
			  
			  <script type="text/javascript">
			jQuery(document).ready(function($) {
				$(".scroll").click(function(event){		
					event.preventDefault();
					$('html,body').animate({scrollTop:$(this.hash).offset().top},1200);
				});
			});
		</script>
			  <!-- Script for gallery Here -->
					<script type="text/javascript" src="./js/jquery.mixitup.min.js"></script>
						<script type="text/javascript">
						$(function () {
							
							var filterList = {
							
								init: function () {
								
									// MixItUp plugin
									// http://mixitup.io
									$('#portfoliolist').mixitup({
										targetSelector: '.portfolio',
										filterSelector: '.filter',
										effects: ['fade'],
										easing: 'snap',
										// call the hover effect
										onMixEnd: filterList.hoverEffect()
									});				
								
								},
								
								hoverEffect: function () {
								
									// Simple parallax effect
									$('#portfoliolist .portfolio').hover(
										function () {
											$(this).find('.label').stop().animate({bottom: 0}, 200, 'easeOutQuad');
											$(this).find('img').stop().animate({top: -30}, 500, 'easeOutQuad');				
										},
										function () {
											$(this).find('.label').stop().animate({bottom: -40}, 200, 'easeInQuad');
											$(this).find('img').stop().animate({top: 0}, 300, 'easeOutQuad');								
										}		
									);				
								
								}
					
							};
							
							// Run the show!
							filterList.init();
							
							
						});	
						</script>
				<!-- Gallery Script Ends -->
				<!-- pop-up-box -->
						  <script type="text/javascript" src="./js/modernizr.custom.min.js"></script>    
						<link href="./css/popuo-box.css" rel="stylesheet" type="text/css" media="all" />
						<script src="./js/jquery.magnific-popup.js" type="text/javascript"></script>
				<!-- //pop-up-box -->
				<div id="small-dialog" class="mfp-hide">
							<div  style="background-color:#272822;color:#fff">
								
								<div>
								<h3>你好大学</h3>
							</div>
							<div class="address">
								 <span>项目职责描述</span>

								 <ul>
									<li>网站前端开发</li>
									<li>与后端同学沟通</li>
									<li>网站风格把握</li>
								 </ul>

								 <span>项目详细描述</span>

								 <ul>
									<li>项目成员：8人</li>
									<li>成果：上千名top100高校志愿者入驻</li>
									<li>开发工具：eclipse，tomcat，mysql，MVC</li>
								 </ul>
							</div>
							<div class="address">
								<span>项目展示地址</span>
								<a href="http://daxuewen.xyz/" target="target_blank">http://daxuewen.xyz/</a>
							</div>
							</div>
						</div>
						<div id="small-dialog1" class="mfp-hide">
							<div  style="background-color:#272822;color:#fff">
								
								<div>
								<h3>吃了么网上点餐系统</h3>
							</div>
							<div class="address">
								 <span>项目职责描述</span>

								 <ul>
									<li>java后台编码</li>
									<li>Sql语句优化</li>
									<li>数据库整体设计</li>
								 </ul>

								 <span>项目详细描述</span>

								 <ul>
									<li>项目成员：3人</li>
									<li>成果：获上海市计算机应用能力大赛优胜奖</li>
									<li>开发工具：eclipse，tomcat，mysql，MVC</li>
								 </ul>
							</div>
							<div class="address">
								<span>网站地址</span>
								<a href="http://cleme.aliapp.com/" target="target_blank">http://cleme.aliapp.com/</a>
							</div>
							</div>
						</div>
						</div>
						
						<div id="small-dialog3" class="mfp-hide">
							<div  style="background-color:#272822;color:#fff">
								
								<div>
								<h3>医药通网上卖药系统</h3>
							</div>
							<div class="address">
								 <span>项目职责描述</span>

								 <ul>
									<li>项目手机客户端开发</li>
									<li>实现设计师的想法</li>
									<li>与后端开发同学沟通，共同完成项目</li>
								 </ul>
								  <span>项目详细描述</span>

								 <ul>
									<li>开发工具：eclipse，tomcat，mysql，MVC</li>
								 </ul>
							</div>
							</div>
						</div>
						</div>
						<div id="small-dialog7" class="mfp-hide">
							<div  style="background-color:#272822;color:#fff">
								
								<div>
								<h3>Linux shell</h3>
							</div>
							<div class="address">
								 <span>项目职责描述</span>

								 <ul>
									<li>shell开发</li>
									<li>函数设计、实现</li>
									<li>程序测试</li>
								 </ul>

								 <span>项目详细描述</span>

								 <ul>
									<li>项目成员：1人</li>
									<li>开发工具：gedit，gcc</li>
								 </ul>
							</div>
							<div class="address">
								<span>项目展示地址</span>
								<a href="http://blog.csdn.net/weiqianghu/article/details/46640403" target="target_blank">http://blog.csdn.net/weiqianghu/article/details/46640403</a>
							</div>
							</div>
						</div>
						</div>
				<script>
							$(document).ready(function() {
							$('.popup-with-zoom-anim').magnificPopup({
								type: 'inline',
								fixedContentPos: false,
								fixedBgPos: true,
								overflowY: 'auto',
								closeBtnInside: true,
								preloader: false,
								midClick: true,
								removalDelay: 300,
								mainClass: 'my-mfp-zoom-in'
							});
																							
							});
				</script>
			</div>
		  </div>
		</div>
		<!-- portfolio-section-ends -->
		<!-- blog-section-starts -->
		<div class="blog-section" id="BLOG">
			<div class="container" style="margin-bottom:50px">
				<div class="blog-section-head text-center">
					<h3>个人博客</h3>
					<label></label>
					<p>Recent blog writings</p>
				</div>
				<div class="blog-section-grids">
					<div class="col-md-9 blog-section-left-grid">
						<div class="blog-section-banner">
							<a target="target_blank" href="http://blog.csdn.net/weiqianghu"><img src="./images/blog.jpg" class="img-responsive" alt=""/></a>
						</div>
					</div>
					<div class="col-md-3 blog-section-right-grid">
						<div class="search">
							<h5>搜索</h5>
							 <div class="search-box">
	                         <form action="http://so.csdn.net/so/search/s.do"> 
	                         <input type="text" class="text" name="q" value="search" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'search';}">
	                          <input type="submit" value>
		                    </form> 
		                  </div>
						</div>
						<div class="clearfix"></div>
						<div class="categories">
							<h5>类别</h5>
							<ul>
								<li><a target="target_blank" href="http://blog.csdn.net/weiqianghu/article/category/5611733">排序算法</a></li>
								<li><a target="target_blank" href="http://blog.csdn.net/weiqianghu/article/category/5611175">c/c++</a></li>
								<li><a target="target_blank" href="http://blog.csdn.net/weiqianghu/article/category/5610729">面试题</a></li>
							</ul>
						</div>
					</div>
					<div class="clearfix"></div>
				</div>
			</div>
		</div>
		<!-- blog-section-ends -->
		<div class="twitter-section">
		    <div class="course_demo">
			          <ul id="flexiselDemo3">	
						<li>
							<p style="padding-top:40px">这个世界不是因为你能做什么，而是你该做什么</p>
						</li>
						<li>
							<p style="padding-top:40px">短暂的激情是不值钱的，只有持久的激情才是赚钱的</p>
						</li>	
						<li>
							<p style="padding-top:40px">聪明是智慧者的天敌，傻瓜用嘴讲话，聪明的人用脑袋讲话，智慧的人用心讲话</p>
						</li>									    	  	       	   	  									    	  	       	   	    	
					</ul>

		  </div>
		  </div>

						<script type="text/javascript">
				$(window).load(function() {
					$("#flexiselDemo3").flexisel({
						visibleItems: 1,
						animationSpeed: 1000,
						autoPlay: false,
						autoPlaySpeed: 3000,    		
						pauseOnHover: true,
						enableResponsiveBreakpoints: true,
				    	responsiveBreakpoints: { 
				    		portrait: { 
				    			changePoint:480,
				    			visibleItems: 1
				    		}, 
				    		landscape: { 
				    			changePoint:640,
				    			visibleItems: 1
				    		},
				    		tablet: { 
				    			changePoint:768,
				    			visibleItems: 1
				    		}
				    	}
				    });
				    
				});
			</script>
			<script type="text/javascript" src="./js/jquery.flexisel.js"></script>	

		<!-- content-section-starts -->
		<div class="contact-section text-center" id="CONTACT">
			<div class="container">
				<div class="contact-section-head">
					<h3>快联系我</h3>
					<label></label>
					<p>Recent blog writings</p>
				</div>
				<div class="contact-info">
					<ul>
						<li><i class="message"></i></li>
						<li><i >weiqianghu_ecust@163.com</i></li>
						<li><i class="phone"></i></li>
						<li>18521595797</li>
					</ul>
					<form>
						<input type="text" class="text" value="你的姓名" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = '你的姓名';}">
						<input type="text" class="text" value="你的Email" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = '你的Email';}">
						<textarea onfocus="if(this.value == '你的 Message') this.value='';" onblur="if(this.value == '') this.value='你的 Message';" >你的 Message</textarea>
						<input type="button" value="发送" onclick="send()">
					</form>
				</div>
			</div>
		</div>
	    </div>
	    <script type="text/javascript"> function send () {
	    	alert("您的消息已提交！");
	    	// body...
	    }</script>
	    <!-- content-section-ends -->
		<!-- footer-section-starts -->
		<div class="footer">
		    <div class="container">
				<div class="copy-rights text-center">
					<p>&copy; 2015 copyright by <a href="#" target="target_blank">WeiqiangHu</a></p>
				</div>
			</div>
		</div>
		<!-- footer-section-ends -->
					  <script type="text/javascript">
							$(document).ready(function() {
								/*
								var defaults = {
						  			containerID: 'toTop', // fading element id
									containerHoverID: 'toTopHover', // fading element hover id
									scrollSpeed: 1200,
									easingType: 'linear' 
						 		};
								*/
								
								$().UItoTop({ easingType: 'easeOutQuart' });
								
							});
						</script>
					<a href="#" id="toTop" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>

	</body>
	</html>